import { Steps } from 'antd';
import React from 'react';
import { Order } from '../../model';

const { Step } = Steps;

interface StepBarProps extends Order {}

const StepBar: React.FC<StepBarProps> = props => {
  const timeline = ['createTime', 'paymentTime', 'deliveryTime', 'receiveTime', 'commentTime'];
  let currentStatus;
  for (const key of timeline) {
    if (props[key] === null) {
      currentStatus = timeline.indexOf(key);
      break;
    }
  }

  return (
    <Steps current={currentStatus || timeline.length}>
      <Step title="提交订单" description={props[timeline[0]]} />
      <Step title="支付订单" description={props[timeline[1]]} />
      <Step title="平台发货" description={props[timeline[2]]} />
      <Step title="确认收货" description={props[timeline[3]]} />
      <Step title="完成评价" description={props[timeline[4]]} />
    </Steps>
  );
};

export default StepBar;
